<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AuthorizeOrder测试</title>
</head>
<body>
<div id="paypal-btn-ty" style="width: 300px;"></div>
<div>
	<input type="text" id="orderId" placeholder="orderId" />
	<button id="paypal-btn-authorize">授权</button>
</div>

<div>
	<input type="text" id="authorizationId" placeholder="authorizationId" />
	<button id="paypal-btn-capture">收钱</button>
</div>

<div>
	<input type="text" id="captureId" placeholder="captureId" />
	<button id="paypal-btn-refund">退款</button>
</div>

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script src="https://www.paypal.com/sdk/js?client-id=Ab5ejrHwwJPS63WP4DjONzX6DbqAo7hzdJHQDrdTJklzFd2M_LaxYa3SpUXADVRAowb2h8ECA2tQjCZ_&intent=authorize"></script>
	<script>
		paypal.Buttons({
			style: {//https://developer.paypal.com/docs/checkout/integration-features/customize-button/   自定义按钮
			    layout:  'vertical',//布局
			    color:   'blue',//颜色
			    shape:   'rect',//形状
			    label:   'paypal'//标签
			  },
		    /* createOrder: function(data, actions) {
		    	console.log("hhhhhhhh")
		      // This function sets up the details of the transaction, including the amount and line item details.
		      return actions.order.create({
		        purchase_units: [{
		          amount: {
		            value: '0.01'
		          }
		        }]
		      });
		    },
		    onApprove: function(data, actions) {//捕获交易
		        // This function captures the funds from the transaction.
		        return actions.order.capture().then(function(details) {
		          // This function shows a transaction success message to your buyer.
		          alert('Transaction completed by ' + details.payer.name.given_name);
		        });
		      } */
		    createOrder: function() {
		    	  return fetch('./create-paypal-transaction2', {
		    	    method: 'post',
		    	    headers: {
		    	      'content-type': 'application/json'
		    	    }
		    	  }).then(function(res) {
		    		  console.log("qaq")
		    		  console.log(res)
		    	    return res.json();
		    	  }).then(function(data) {
		    		  console.log("wuwuwu")
		    		  $("#orderId").val(data.body)
		    	    return data.body; // Use the same key name for order ID on the client and server
		    	  });
		    },
		    onApprove: function(data, actions) {

		        // Authorize the transaction
		        actions.order.authorize().then(function(authorization) { //由客户端发起的授权

		          // Get the authorization id
		          var authorizationID = authorization.purchase_units[0]
		            .payments.authorizations[0].id
				console.log("authorizationID:"+authorizationID)
				 $("#authorizationId").val(authorizationID)
		          // Call your server to validate and capture the transaction
		          return fetch('/paypal-transaction-complete', {
		            method: 'post',
		            headers: {
		              'content-type': 'application/json'
		            },
		            body: JSON.stringify({
		              orderID: data.orderID,
		              authorizationID: authorizationID
		            })
		          });
		        });
		      }
		  }).render('#paypal-btn-ty');
		
		$(document).ready(function(){
			  $("#paypal-btn-refund").click(function(){
				  $.ajax({
					  url:"./paypal-refund",
					  type:'POST',
					  data:{
						  captureId:$("#captureId").val()
					  },
					  success:function(result){
						  alert("已退款...")
				  	  }
				  });
			  });
			  $("#paypal-btn-authorize").click(function(){
				  $.ajax({
					  url:"./paypal-authorize",
					  type:'POST',
					  data:{
						  orderId:$("#orderId").val()
					  },
					  success:function(result){
						  alert("已授权...")
				  	  }
				  });
			  });
			  $("#paypal-btn-capture").click(function(){
				  $.ajax({
					  url:"./paypal-capture",
					  type:'POST',
					  data:{
						  authorizationId:$("#authorizationId").val()
					  },
					  success:function(result){
						  alert("已收钱...")
				  	  }
				  });
			  });
			});
	</script>
</body>
</html>